<html>
<head>
<title>{% block title %}Elyphoot{% endblock %}</title>
{% block head %}
<script type="text/javascript" src="{{ STATIC_URL }}js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}js/jquery-ui-1.8.21.custom.min.js"></script>
<style type="text/css">
body {
  font-family: arial;
  background-color: green;
  color: white;
  position: relative;
}

h1 {
  margin-bottom: 10px;
}

h2 {
  margin: 0;
  background-color: #eee;
  padding: 5px;
  font-size: 1.2em;
}

.text {
  border: 1px solid black;
  background-color: white;
  color: black;
}

.contents {
  padding: 10px;
}

#logout {
    position: absolute;
    top: 0px;
    right: 0px;
}

</style>
{% endblock %}
</head>

<body>
{% if user.is_authenticated %}
    <div id="logout"><a href="/logout">logout</a></div>
{% endif %}
{% block contents %}{% endblock %}

</body>
</html>